import React, { useState } from 'react';
import { EditableProTable } from '@ant-design/pro-table';
import ProField from '@ant-design/pro-field';
import ProCard from '@ant-design/pro-card';
import { Button } from 'antd';


export default ({columns,value,onChange,rowKey,maxLength}) => {

  return (
      <EditableProTable
        maxLength={maxLength}
        columns={columns}
        rowKey={rowKey}
        value={value||[]}
        onChange={onChange}
        recordCreatorProps={{
          newRecordType: 'dataSource',
          record: () => ({
            [rowKey]: Date.now(),
          }),
        }}
        editable={{
          type: 'multiple',
          editableKeys:value ?value.map((item) => item[rowKey]):[],
          actionRender: (row, config, defaultDoms) => {
            return [defaultDoms.delete];
          },
          onValuesChange: (record, recordList) => {
            onChange(recordList);
          },
        }}
      />
  );
};